﻿#if($msg)
<script>
alert('$!msg');
</script>
#end
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>图片集管理</title>
<link href="/include/manage/images/main/style.css" rel="stylesheet" type="text/css" />
<link href="/include/manage/ui/jquery-ui.css" rel="stylesheet" type="text/css" />
<style type="text/css">
#thumbnails{list-style:none;margin-left:0;}
#thumbnails li{
	float:left;
	width:124px;
	border:1px solid gray;
	margin:4px;
}
#thumbnails li img.view{
	margin:1px;
	border:1px solid #F1F1F1;
}
input.noborder{
	border:none;
}
input.border{
	border:1px solid gray;
}
</style>
<script language="javascript" src="/include/manage/js/jquery.js"></script>
<script type="text/javascript" src="/include/manage/js/jquery-ui.js"></script>
<script type="text/javascript" src="/include/manage/swfupload/swfupload.js"></script>
<script type="text/javascript" src="/include/manage/swfupload/swfupload.queue.js"></script>
<script type="text/javascript" src="/include/manage/swfupload/fileprogress.js"></script>
<script type="text/javascript" src="/include/manage/swfupload/pic_handlers.js"></script>
<script type="text/javascript" src="/include/manage/js/portal_pic.js"></script>
<script language="javascript">
var sel_all=false;
var gen_spic=0;
var settings;
var news_id="$!newsid";
var nowOrder=null;

jQuery.ajaxSetup ({  
	cache: false
});

$(function(){
				$('.button').button();
				$('#dialog').dialog({
					autoOpen: false,
					width: 600,
					buttons: {
						"确定": function() {
							$(this).dialog("close");
						}
					}
				});
				$('#dialog_link').click(function(){
					$('#dialog').dialog('open');
					return false;
				});
				
				$('#selAll').click(function(){
					if(sel_all==true){
						$('.sel_input').removeAttr("checked");//取消全选
						sel_all=false;
					}else{
						$('.sel_input').attr("checked",'true');//全选
						sel_all=true;
					}
				});
			//初始化上传组件
			settings = {
				flash_url : "/include/manage/swfupload/swfupload.swf",
				upload_url: "/ImageUpload?sid=$!thisSite.id",
				use_query_string : true,
				file_size_limit : "10 MB",
				file_types : "*.jpg;*.gif;*.bmp;*.png",
				file_types_description : "图片文件",
				file_upload_limit : 150,
				file_queue_limit : 0,
				custom_settings : {
					progressTarget : "fsUploadProgress",
					cancelButtonId : "btnCancel"
				},
				debug: false,
				// Button settings
				button_image_url: "/include/manage/swfupload/XPButtonUploadText_61x22.png",
				button_width: "61",
				button_height: "22",
				button_placeholder_id: "spanButtonPlaceHolder",
				
				moving_average_history_size: 40,
				
				// The event handler functions are defined in handlers.js
				file_queued_handler : fileQueued,
				file_queue_error_handler : fileQueueError,
				file_dialog_complete_handler : fileDialogComplete,
				upload_start_handler : uploadStart,
				upload_progress_handler : uploadProgress,
				upload_error_handler : uploadError,
				upload_success_handler : uploadSuccess,
				upload_complete_handler : uploadComplete,
				queue_complete_handler : queueComplete	// Queue plugin event
			};

			swfu = new SWFUpload(settings);

});

function editPic(picurl){
	if(picurl.length>0){
		var host = window.location.hostname;
		var port = window.location.port;
		var domainName = "http://" + host;
		if(port != ""){
			domainName += ":" + port;
		}
		location.href='/picedit/MediaCreator.jsp?pic='+domainName+picurl;
	}
}

function updateTitle(picid,t){
	$.get('/manage_pic_ajax.ad',{parameter:'updateTitle',id:picid,title:t},function(data){
		//alert(data);
	});
}

function delPic(id){
	if(confirm('确定要删除吗?')){
		$('#pids').val(id);
		$('#delform').submit();
	}
}

function delSel(){
	if(confirm('确定要删除吗?')){
		var str='';
        $("[name='sel_id'][checked]").each(function(){
              str+=$(this).val()+",";
         });
         $('#pids').val(str);
         $('#delform').submit();
	}
}

function showSpicSetting(){
	if($('#spicsetting')[0].style.display=='none'){
		$('#spicsetting')[0].style.display='';
		gen_spic=1;
	}else{
		$('#spicsetting')[0].style.display='none';
		gen_spic=0;
	}
}
</script>
</head>
<body>
<form id="delform" name="delform" action="/manage_pic.ad" method="post">
	<input type="hidden" name="parameter" value="delete" />
	<input type="hidden" name="newsid" value="$!thisNews.id" />
	<input id="pids" type="hidden" name="id" />
</form>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td height="30" background="/include/manage/images/main/tab_05.gif"><table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="12" height="30"><img src="/include/manage/images/main/tab_03.gif" width="12" height="30" /></td>
        <td><table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td width="46%" valign="middle"><table width="100%" border="0" cellspacing="0" cellpadding="0">
              <tr>
                <td width="5%"><div align="center"><img src="/include/manage/images/main/tb.gif" width="16" height="16" /></div></td>
                <td width="95%"><span class="STYLE3">当前位置</span>：[内容管理]-[图 片 集]</td>
              </tr>
            </table></td>
            <td width="54%"><table border="0" align="right" cellpadding="0" cellspacing="0">
              <tr>
								#if($thisNews.id)
                <td width="80"><table width="90%" border="0" cellpadding="0" cellspacing="0">
                  <tr>
                    <td><div align="center"><a href="/manage_news.ad?parameter=edit&id=$!thisNews.id"><img src="/include/manage/images/main/22.gif" width="14" height="14" /></a></div></td>
                    <td><div align="center"><a href="/manage_news.ad?parameter=edit&id=$!thisNews.id">返回文章</a></div></td>
                  </tr>
                </table></td>
								#end
            #if($thisType.tree)
            #if($thisType.tree.length()>0)
                <td width="80"><table width="90%" border="0" cellpadding="0" cellspacing="0">
                  <tr>
                    <td><div align="center"><a href="/manage_pic.ad?parameter=tree&treeid=$thisType.tree"><img src="/include/manage/images/main/22.gif" width="14" height="14" /></a></div></td>
                    <td><div align="center"><a href="/manage_pic.ad?parameter=tree&treeid=$thisType.tree">附加分类</a></div></td>
                  </tr>
                </table></td>
            #end
            #end
                <td width="52"><table width="88%" border="0" cellpadding="0" cellspacing="0">
                  <tr>
                    <td><div align="center"><a href="javascript:delSel()"><img src="/include/manage/images/main/11.gif" width="14" height="14" /></a></div></td>
                    <td><div align="center"><a href="javascript:delSel()">删除</a></div></td>
                  </tr>
                </table></td>
              </tr>
            </table></td>
          </tr>
        </table></td>
        <td width="16"><img src="/include/manage/images/main/tab_07.gif" width="16" height="30" /></td>
      </tr>
    </table></td>
  </tr>
  <tr>
  	<td>
	<table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="8" background="/include/manage/images/main/tab_12.gif">&nbsp;</td>
        <td>
			<table class="edit_list" width="100%" cellspacing="0" cellpadding="0">
					<tr>
						<th width="*" height="38" align="left"><h4>#if($thisNews.id)“$!thisNews.title”的#end图片集</h4></th>
						<th width="250" align="right">
							<div style="float: right">
							<input id="selAll" type="button" class="button" value="全选"/>
							<input id="dialog_link" type="button" class="button" value="添加图片"/>
							<input type="button" class="button" value="删除选定" onClick="delSel()" />
							</div>
						</th>
					</tr>
					<tr>
						<td colspan="2">
						<div>
						<ul id="thumbnails" class="column">
                        #foreach ($pic in $picList)
						<li class="portlet" id="$!pic.id">
							<img src="$!pic.url" width="120" class="view"/><br/>
							<input name="sel_id" type="checkbox" class="sel_input" value="$!pic.id" />
							<input style="width:90px" name="pictitle" type="text" class="noborder" #if($pic.title)#if($pic.title.length()>0) value="$!pic.title"#else value="未命名"#end #else value="未命名"#end onclick="if(this.value=='未命名'){this.value='';};this.className='border';" onblur="updateTitle('$!pic.id',this.value);if(this.value==''){this.value='未命名';};this.className='noborder';"/>
                            <a href="javascript:editPic('$!pic.url')"><img src="/include/manage/images/main/edt.gif" align="absmiddle"/>编辑</a>
							<a href="javascript:delPic('$!pic.id')"><img src="/include/manage/images/main/del.gif" align="absmiddle"/>删除</a>
							
						</li>
                        #end
                        </ul>
                        </div>
                        </td>
                     </tr>
             </table>
		</td>
        <td width="8" background="/include/manage/images/main/tab_15.gif">&nbsp;</td>
      </tr>
    </table></td>
    </tr>
  <tr>
    <td height="35" background="/include/manage/images/main/tab_19.gif"><table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td width="12" height="35"><img src="/include/manage/images/main/tab_18.gif" width="12" height="35" /></td>
        <td valign="top">
        
<table width="100%" border="0" cellspacing="0" cellpadding="0">
          <tr>
            <td class="STYLE4">&nbsp;&nbsp;共有 $!rows 条记录，当前第 $!currentPage/$!totalPage 页</td>
            <td><table border="0" align="right" cellpadding="0" cellspacing="0">
                <tr>
                  <td width="40"><a href="/manage_pic.ad?parameter=page&page=1&newsid=$!newsid"><img src="/include/manage/images/main/first.gif" width="37" height="15" /></a></td>
                  <td width="45">#if($frontPage<1)<img src="/include/manage/images/main/back-no.gif" width="43" height="15" />#else<a href="/manage_pic.ad?parameter=page&page=$!frontPage&newsid=$!newsid"><img src="/include/manage/images/main/back.gif" width="43" height="15" /></a>#end</td>
                  <td width="45">#if($nextPage>$totalPage)<img src="/include/manage/images/main/next-no.gif" width="43" height="15" />#else<a href="/manage_pic.ad?parameter=page&page=$!nextPage&newsid=$!newsid"><img src="/include/manage/images/main/next.gif" width="43" height="15" /></a>#end</td>
                  <td width="40"><a href="/manage_pic.ad?parameter=page&page=$!totalPage&newsid=$!newsid"><img src="/include/manage/images/main/last.gif" width="37" height="15" /></a></td>
                  <td width="100"><div align="center"><span>转到第
                    <input id="goPage" name="goPage" type="text" size="4" style="height:16px; width:20px; border:1px solid #999999;" /> 
                    页 </span></div></td>
                  <td width="40"><a href="javascript:location.href='/manage_pic.ad?parameter=page&newsid=$!newsid&page='+document.getElementById('goPage').value"><img src="/include/manage/images/main/go.gif" width="37" height="15" /></a></td>
                </tr>
            </table></td>
          </tr>
        </table>
        
        </td>
        <td width="16"><img src="/include/manage/images/main/tab_20.gif" width="16" height="35" /></td>
      </tr>
    </table>
	</td>
  </tr>
</table>

        <div id="dialog" title="上传图片">
        <form method="post" action="/manage_pic.ad" enctype="multipart/form-data">
						<table width="100%" cellspacing="0" cellpadding="0">
							<tr>
								<td colspan="4">
									<div class="fieldset flash" id="fsUploadProgress">
										<span class="legend">上传队列</span>
									</div>
									<div id="divStatus">
										已上传 0 个图片
									</div>
									<div>
										<span id="spanButtonPlaceHolder"></span>
										<span><input id="spic" name="spic" type="checkbox" value="1" onClick="showSpicSetting()" /><label for="spic">生成缩略图</label></span>
									</div>
									<div id="spicsetting" style="display:none">
										缩略图宽：<input id="swidth" type="text" name="swidth" value="100" />
										缩略图高：<input id="sheight" type="text" name="sheight" value="100" />
									</div>
								</td>
							</tr>
						</table>
		</form>
        </div>
</body>
</html>